<!DOCTYPE html>
<html><head>
<style type="text/css">
	td {
		background: lightblue;
		padding: 0.5em;
	}
	.grayscale {
		filter: url(filters.svg#grayscale);
	}
	.blur {
		filter: url(filters.svg#blur);
	}
	.grayscaleBlur {
		filter: url(filters.svg#grayscaleBlur);
	}
</style>
</head><body>

<table><tr>
<td>normal</td>
<td class="grayscale">grayscale</td>
</tr><tr>
<td class="blur">blur</td>
<td class="grayscaleBlur">grayscaleBlur</td>
</tr></table>

<img src="barretr_Earth.png" width="100" height="100" />
<img class="grayscale" src="barretr_Earth.png" width="100" height="100" /><br />
<img class="blur" src="barretr_Earth.png" width="100" height="100" />
<img class="grayscaleBlur" src="barretr_Earth.png" width="100" height="100" />

</body></html>
